<title>文章列表</title>
<div class="layui-card layadmin-header">
<div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a lay-href="">主页</a>
    <a><cite>应用</cite></a>
    <a><cite>文章列表</cite></a>
</div>
</div>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <table id="myarticle" lay-filter="myarticle"></table>
            <script type="text/html" id="table-content-list">
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="change"><i class="layui-icon layui-icon-edit"></i>编辑</a>
                <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
            </script>
        </div>
        <div id="articlePage" style="text-align: center"></div>
    </div>
</div>

<script>
layui.use(['admin', 'table','server','laypage'], function(){
    var $ = layui.$
    ,admin = layui.admin
    ,table = layui.table
    ,form = layui.form
    ,server = layui.server
    ,setter = layui.setter
    ,laypage = layui.laypage
    var options = {};
    var page_size = setter.page_size;
    var main = {page_size:page_size,page:1};
    options.url = 'allArticle';
    options.data = main;
    options.callback = function(data){
        //  return console.log(data);
        var result = [];
        if(data.total > 0){
            result = data.data;
        }
        table.render({
            elem: '#myarticle',
            limit:page_size,
            cols: [[
                {field:'id',type: 'checkbox',hide:true},
                {field: 'title',title: '标题'},
                {field: 'time', title: '时间'},
                {field: 'watch', title: '查看'},
                {fixed: 'right', align:'center', toolbar: '#table-content-list',title:'操作',width:'20%'}
            ]],
            data:result
        });

        Articlepage(data,main);
    }
    server.req(options);

    table.on('tool(myarticle)',function(obj){
        var linedata = obj.data; //获得当前行数据
        var layEvent = obj.event;
        if(layEvent == 'del'){
            layer.confirm('确定删除？',{
                btn: ['删除','不得']
            },function(){
                var del_options = {};
                del_options.url = 'delArticle';
                del_options.data = {
                    id:linedata.id
                },
                del_options.callback = function(data){
                    obj.del();
                    layer.closeAll();
                }
                server.req(del_options);
            });
        }else if(layEvent == 'change'){
            var get_article = {};
            get_article.url = 'getArticle';
            get_article.data = {id:linedata.id};
            //  这里要同步请求
            get_article.aysn = true;
            get_article.callback = function(data){
                layui.sessionData('changeTable',{
                    key:'changeArticle',
                    value:data
                });
                location.replace('#/article/newarticle');
            }
            server.req(get_article);
        }
    });
    

    function Articlepage(data,main) {
        laypage.render({
            elem: 'articlePage',
            count: data.total,
            limit:page_size,
            jump: function(obj, first){
                // //首次不执行
                if(!first){
                    main.page = obj.curr;
                    reloagArticleTable(main);
                }
            }
        });
    }

    function reloagArticleTable(main){
        var options = {};
        options.url = 'allArticle';
        options.data = main;
        options.callback = function(data){
            var result = [];
            if(data.total >0){
                result = data.data;
            }
            table.reload('myarticle', {
                data:result
            });
        }
        server.req(options);
    }
});
</script>
